import Permission from '@/components/permissions/Permission'
import { MenuDataItem } from '@ant-design/pro-components'
import { createBrowserRouter, RouteObject } from 'react-router-dom'
import { routers, routers1 } from './routers'

export type RouteType = {
  /** 是否隐藏菜单布局 */
  hideLayout?: boolean
  /** 在菜单栏是否显示 */
  hideInMenu?: boolean
  /** 权限控制 true 则都控制 */
  permissionObj?: {
    /** 是否进行页面权限控制，控制取后端数据 */
    isPagePermission?: boolean
    /** 判断token是否存在控制 */
    isToken?: boolean
  } & true
  children?: RouteType[]
} & Partial<MenuDataItem> &
  RouteObject

/** 只给最低层级套 Permission 组件 */
const renderElement = (item: RouteType) => {
  if (item?.element) {
    if (item?.children) {
      return item?.element
    }
    return (
      <Permission name={item?.name} permissionObj={item?.permissionObj}>
        {item?.element}
      </Permission>
    )
  }
  return undefined
}

const reduceRoute: (params: RouteType[]) => RouteType[] = (routesParams: RouteType[]) => {
  // if (Array.isArray(routesParams)) {
  //     console.log('Expected an array, but got:', routesParams);
  //     return []; // 如果不是数组，返回空数组
  // }
  return routesParams?.map(item => {
    let curRouter = item
    if (item?.permissionObj) {
      curRouter = {
        ...curRouter,
        element: renderElement(item)
      }
    }
    if (item?.children) {
      curRouter = {
        ...curRouter,
        children: reduceRoute(item?.children) as any
      }
    }
    return curRouter
  })
}
const reduceRoute1 = async (routesParams: RouteType[]): Promise<RouteType[]> => {
  if (!Array.isArray(routesParams)) return []

  return Promise.all(
    routesParams.map(async item => {
      const curRouter = { ...item }

      if (item?.permissionObj) {
        curRouter.element = renderElement(item)
      }

      if (item?.children) {
        curRouter.children = await reduceRoute(item.children)
      }

      return curRouter
    })
  )
}

// const reduceRoute = async (routesParamsPromise: Promise<RouteType[]>): Promise<RouteType[]> => {
//     const routesParams = await routesParamsPromise;
//     console.log('routesParams---',routesParams)
//     if (Array.isArray(routesParams)) {
//         console.log('Expected an array, but got:', routesParams);
//         return []; // 如果不是数组，返回空数组
//     }
//     return routesParams?.map(item => {
//         const curRouter = item
//         if (item?.permissionObj) {
//             curRouter = {
//                 ...curRouter,
//                 element: renderElement(item)
//             }
//         }
//         if (item?.children) {
//             curRouter = {
//                 ...curRouter,
//                 children: reduceRoute(item?.children) as any
//             }
//         }
//         return curRouter
//     })
// }

// console.log(routers)
// const relRouters = routers.then((rod)=>{
//     reduceRoute(rod)
// })
export async function initializeRouter() {
  const fetchedRoutes:any = await routers1() // 等待异步路由数据
  const processedRoutes = await reduceRoute1(fetchedRoutes) // 处理路由配置
//   console.log(processedRoutes,'processedRoutes')
  return createBrowserRouter(processedRoutes) // 生成路由器
}

const relRouters = reduceRoute(routers)
export const routerOld = createBrowserRouter(relRouters)
// console.log(routerOld,'router')
